import { createApp } from 'vue';
import App from '@/App.vue';
// import { createPinia } from 'pinia'
// import router from './router'

const app = createApp(App);

// app.use(createPinia())
// app.use(router)

// 将 Mitt 进行全局配置
import mitt from 'mitt';
const Mitt = mitt();
// 使用 TypeScript 的模块声明语法，用于向 Vue 3 的类型系统添加自定义属性
// 必须要拓展ComponentCustomProperties类型才能获得类型提示
declare module 'vue' {
  export interface ComponentCustomProperties {
    $Bus: typeof Mitt;
  }
}
// 把插件的 API 挂载全局变量到实例上
app.config.globalProperties.$Mitter = Mitt;

// -----------------------------------------------------------------------------------------------------------------------------------------------------------------------
// 固定写法 在 main.ts 中声明文件 不然TS无法正确类型推导
// 声明要扩充@vue/runtime-core包的声明.
// 这里扩充"ComponentCustomProperties"接口, 因为他是vue3中实例的属性的类型.
declare module 'vue' {
  export interface ComponentCustomProperties {
    $var: string;
    $filter: Function;
  }
}
// 使用 globalProperties 定义全局变量
app.config.globalProperties.$var = 'globalProperties 全局变量';
// 使用 globalProperties 定义全局方法：实现过滤器
app.config.globalProperties.$filter = (variable: any) => {
  return variable + '全局方法实现过滤器';
};
// 使用 provide 定义
const $varProvide = 'provide 定义的全局属性';
app.provide('$varProvide', $varProvide);

// 自定义插件
declare module '@vue/runtime-core' {
  export interface ComponentCustomProperties {
    $customPlugin: any;
  }
}
import customPlugin from './views/customPlugin/costomPlugin';
app.use(customPlugin);

// 注册普通 pinia
import { createPinia } from 'pinia';
const store = createPinia();
// 注册含持久化插件的 pinia
// const piniaPlugin = (context: PiniaPluginContext) => {};
import { PersistencePlugin } from '@/store/pinia/PersistencePlugin';
// 自定义下面 key  所以需要传对象,PersistencePlugin 就需要函数柯里化
store.use(PersistencePlugin({ key: 'pinia' }));
app.use(store);

// 挂载路由
import router from '@/router';
app.use(router);

app.mount('#app');
